<?php
session_start();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
<title>Welcome to YouDo!</title>
<link rel="stylesheet" href="css/welcome.css" type="text/css" media="screen" charset="utf-8"/>
<script type="text/javascript" src="js/jquery-1.4.2.js" charset="utf-8"> </script>
<script type="text/javascript" charset="utf-8">


$(document).ready(function() {

	$(".form-input").live('focus', function() {
		$(this).attr("value", "");
		$(this).css({"color": "black"});
	});

	$(".user-button").live('click', function(e) {
		e.preventDefault();
		var url = $(this).attr("href");
		$("#user-form").empty().load(url);
	});

	$("#username").live('keyup', function() {
		var length = $(this).length;
		if(length > 0) {
			$(this).removeClass("invalid").addClass("valid");
			$(this).clearQueue().css({"border": "2px solid #0F0"});
		}

		else {
			$(this).removeClass("valid").addClass("invalid");
			$(this).delay(1000).queue(function(next) {
				$(this).css({"border": "2px solid red"});
				next();
			});
		}
	});

	$("#email").live('keyup', function() {
		var isValid = emailCheck($(this).val());
		if(isValid) {
			$(this).removeClass("invalid").addClass("valid");
			$(this).clearQueue().css({"border": "2px solid #0F0"});
		}
		else {
			$(this).removeClass("valid").addClass("invalid");
			$(this).delay(1000).queue(function(next) {
				$(this).css({"border": "2px solid red"});
				next();
			});
		}
	});

});

function emailCheck(email) {
	var regex = /^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$/
	console.log(email.match(regex));
	if(email.match(regex)) return true;
	else return false;
}
</script>
<link rel="stylesheet" href="css/register.css" type="text/css" media="screen" charset="utf-8"/>
</head>
<body>
<div id="content">
	<h1><img src="img/header.png"></h1>
	<div id="user-form">
	<?php require("login.php"); ?>
	</div>
	<a class="user-button" href="register.php">Register</a>
	or
	<a class="user-button" href="login.php">Login</a>
</div>
</body>
</html>
